<template>
  <view class="container">
    <view class="title">华创-XXX</view>
    <view class="inputForm">
      <!-- <view class="logo">
        
        <image src="../../static/logIn.png" mode=""></image>
      </view> -->
      <view class="input-info">
        <view class="info">
          <uni-easyinput
            type="text"
            maxlength="10"
            class="input"
            v-model="input.userId"
            placeholder="请输入帐号"
          />
          <view class="more"></view>
        </view>
        <view class="info">
          <uni-easyinput
            type="password"
            maxlength="10"
            class="input"
            v-model="input.password"
            @input="replacePassword"
            placeholder="请输入密码"
          />
        </view>
      </view>
      <view class="btn-info">
        <button type="primary" @click="onLogin" :disabled="!isReady">
          登录
        </button>
      </view>
      <view class="register">
        <view @click="onRegister">还没帐号，立刻申请</view>
      </view>
    </view>
    <view class="agreement" @click="showAgreement">
      <checkbox style="transform: scale(0.7)" value="agree" />
      <span> 我已阅读并同意 </span>
      <span class="item"> 《用户协议》 </span>
      <span> 和</span>
      <span class="item"> 《隐私政策》 </span>
    </view>
  </view>
</template>

<script>
import { logIn, getUserInfo } from "../../apis/api";
import { isCustomer, isPE, markLogin } from "../../utils/permission";

export default {
  data() {
    return {
      isReady: false,
      // 表单
      input: {
        userId: "",
        password: "",
      },
      agree: false,
    };
  },
  computed: {
    // ...mapState(["hasLogin", "userInfo"]),
    // ...mapGetters(["getIsCustomer", "getIsPE"]),
  },
  methods: {
    onRegister() {
      // uni.reLaunch({
      //   url: "/pages/register/register",
      // });

      // uni.redirectTo({
      //   url: "/pages/register/register",
      // });

      uni.navigateTo({
        url: "/pages/register/register",
      });
    },
    replacePassword(value) {
      var q = /[\u4E00-\u9FA5]/;
      if (q.test(value)) {
        this.$nextTick(() => {
          this.input.password = value.replace(/[\u4E00-\u9FA5]/g, "");
        });
      }
    },
    showAgreement() {},
    validate() {
      if (!this.input.userId) {
        return Promise.reject({ message: "请输入帐号" });
      }
      if (!this.input.password) {
        return Promise.reject({ message: "请输入密码" });
      }
      if (!this.agreement !== true) {
        return Promise.reject({
          message: "请阅读并同意《用户协议》和《隐私政策》",
        });
      }
      return Promise.resolve();
    },
    tryLogIn() {
      let user = {
        userId: this.input.userId,
        password: this.input.password,
      };

      return logIn(user).then((logInRes) => {
        let result = logInRes.data.result;
        if (result.status === 1) {
          return getUserInfo(this.input.userId).then((res) => {
            return markLogin(
              logInRes.data.result.token,
              res.data.result.userInfo
            ).then(() => {
              return Promise.resolve(res.data.result);
            });
          });
        } else {
          return Promise.reject({ message: result.message });
        }
      });
    },
    onLogin() {
      this.validate()
        .then(() => {
          uni.showLoading({
            title: "登录中...",
          });

          this.tryLogIn()
            .then((res) => {
              uni.hideLoading();

              if (isCustomer()) {
                uni.reLaunch({
                  url: "../apply/apply",
                });
              } else if (isPE()) {
                uni.reLaunch({
                  url: "../approve/approve",
                });
              } else {
                return Promise.reject({ message: "暂不支持该用户类型" });
              }
            })
            .catch((err) => {
              uni.hideLoading();
              uni.showModal({
                content: err.message,
                showCancel: false,
              });
            });
        })
        .catch((err) => {
          uni.showToast({
            title: err.message,
            // icon: "error",
            icon: "none",
          });
        });
    },
  },
  watch: {
    input: {
      handler(newValue, oldValue) {
        if (!newValue.userId || !newValue.password) {
          this.isReady = false;
        } else {
          this.isReady = true;
        }
      },
      deep: true,
    },
  },
};
</script>

<style lang="scss">
@import "login.scss";
</style>
